<script>
export default {
  name: "FeiPinHuiShouComponent",
  data(){
    return{
      dialogFormVisible:false,
      input:'',
      value1:'',
      FeiPin:{},

      form: {
        name: '8',
        age:'10',
        region: '',
        date1: '',
        date2: '',
        delivery: false,
        type: [],
        resource: '',
      },
      radio1: '全部',
      formLabelWidth: '120px',

    }
  },
 created () {
    this.axios.post("http://43.143.190.87:8091/panghudaojiaBackend/recycleOrder/updateRecyclePrice",{
      paperPrice: 0.4,
      plasticPrice: 0.8,
    }).then((res)=>{
      console.log(res.data);
    })
  },

}

</script>

<template>
<div class="feipin">
<!--  大标题-->
  <div class="tittle">
    <span>今日指导价格:</span>
    <span>纸品类:</span>
    <span>{{form.name}}元/斤</span>
    <span class="suliao">塑料瓶类:</span>
    <span>{{form.age}}元/个</span>

    <el-button class="anniu1" type="text" @click="dialogFormVisible = true">编辑价格</el-button>
    <el-dialog title="编辑今日指导价格" :visible.sync="dialogFormVisible">
      <el-form :model="form">
        <el-form-item label="纸品类" :label-width="formLabelWidth">
          <el-input class="inputs" v-model="form.name" autocomplete="off"></el-input>
        </el-form-item>
        <el-form-item label="塑料瓶类" :label-width="formLabelWidth">
          <el-input class="inputs" v-model="form.age" autocomplete="off"></el-input>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="dialogFormVisible = false">修 改</el-button>
        <el-button @click="dialogFormVisible = false">取 消</el-button>
      </div>
    </el-dialog>
  </div>
<!--边框-->
  <div>
    <span>用户手机号:</span>
    <el-input class="input1" v-model="input" placeholder="请输入用户手机号"></el-input>
    <span class="lefts">用户名字:</span>
    <el-input class="input1" v-model="input" placeholder="请输入用户名字"></el-input>
    <span class="lefts">小区名字:</span>
    <el-input class="input1" v-model="input" placeholder="请输入小区名字"></el-input>
    <br/>
    <span class="lefts" style="margin-top: 25px;margin-left: 0">添加时间:</span>
    <el-date-picker class="datas"
                    v-model="value1"
                    type="daterange"
                    range-separator="至"
                    start-placeholder="开始日期"
                    end-placeholder="结束日期">
    </el-date-picker>

    <span style="margin-left: 25px">状态:</span>
    <div class="border">
      <el-radio-group v-model="radio1">
        <el-radio-button label="全部"></el-radio-button>
        <el-radio-button label="已取消"></el-radio-button>
        <el-radio-button label="待接单"></el-radio-button>
        <el-radio-button label="进行中"></el-radio-button>
        <el-radio-button label="已完成"></el-radio-button>
      </el-radio-group>

      <el-button class="sousuo" type="primary">搜索</el-button>
    </div>
  </div>

  <div>
    <el-table
        :data="FeiPin.list"
        border
        :header-cell-style="{background:'#46a6ff','text-align':'center',color:'white'}"
        style="width: 1250px"
        max-height="100%">
      <el-table-column
          fixed
          prop="ID"
          label="订单ID"
          width="80">
      </el-table-column>
      <el-table-column
          prop="phone"
          label="用户手机号"
          width="100">
      </el-table-column>
      <el-table-column
          prop="name"
          label="用户昵称"
          width="100">
      </el-table-column>
      <el-table-column
          prop="Community"
          label="所属小区"
          width="100">
      </el-table-column>
      <el-table-column
          prop="Recycle-address"
          label="回收地址"
          width="100">
      </el-table-column>
      <el-table-column
          prop="memo"
          label="备注信息"
          width="100">
      </el-table-column>
      <el-table-column
          prop="addTime"
          label="下单时间"
          width="140">
      </el-table-column>
      <el-table-column
          prop="state"
          label="状态"
          width="100">
      </el-table-column>
      <el-table-column
          prop="Recycler"
          label="回收员"
          width="100">
      </el-table-column>
      <el-table-column
          prop="Time"
          label="上门时间"
          width="110">
      </el-table-column>
      <el-table-column
          prop="Recovery-amount"
          label="回收金额"
          width="110">
      </el-table-column>
      <el-table-column
          fixed="right"
          label="操作"
          width="100">
        <template slot-scope="scope">
          <el-button
              @click.native.prevent="deleteRow(scope.$index, tableData)"
              type="text"
              size="small">
            移除
          </el-button>
        </template>
      </el-table-column>
    </el-table>
  </div>

  <div class="fenye">
    <el-pagination
        :total="1"
        layout="prev, pager, next">
    </el-pagination>
  </div>

</div>
</template>

<style scoped>
.feipin{
  height: 500px;
  margin-top: 20px;
  margin-right: 20px;
}

.tittle{
  background-color: #F0F0F0;
  height: 155px;
  border-radius: 10px;
  padding-left: 20px;
  padding-right: 20px;
}

.tittle span{
  font-size: 27px;
  line-height: 155px;
  margin-right: 20px;
}
.tittle span:nth-child(1){
  color: #1E9FFF;
}
.suliao{
  margin-left: 15px;
}

.anniu1{
  background-color: #1E9FFF;
  float: right;
  height: 40px;
  margin-top: 65px;
  color: white;
  width: 100px;

}

.inputs{
  width: 300px;
  border-radius: 2px 0 0 2px;
}
.input1{
  width: 200px;
  margin-top: 20px;
  margin-left: 10px;
}
.lefts{
  display: inline-block;
  margin-left: 20px;
}
.datas{
  margin-left: 10px;
}
.zhuangtai{
  display: inline-block;
}
.border{
  margin-top: 25px;
  font-size: 18px;
  margin-bottom: 30px;
  display: inline-block;
}
.border{
  margin-left: 10px;

}
.sousuo{
  margin-left: 20px;
}
.fenye{
  margin-top: 20px;
}

</style>